#![allow(non_snake_case)]
use dioxus::{html::h1, prelude::*};
use dioxus_desktop::{tao::{event::WindowEvent, event_loop::{ControlFlow, EventLoop}, menu::{ContextMenu, CustomMenuItem, MenuItemAttributes}, system_tray::{Icon, SystemTrayBuilder}}, Config, WindowBuilder};

fn main() -> anyhow::Result<()>{
    let win = WindowBuilder::new().with_title("BeeHosts");

    let ib = image::open("icons/icon.png")?.into_rgb8();
    let (w, h) = ib.dimensions();
    let rgba = ib.into_raw();
    println!("w={w},h={h}");
    let icon = Icon::from_rgba(rgba, 768, 768)?;

    let mut el = EventLoop::new();

    let mut tray_menu = ContextMenu::new();
    tray_menu.add_item(MenuItemAttributes::new("System"))
    .set_icon(icon.clone());


    let mut system_tray = SystemTrayBuilder::new(icon.clone(), Some(tray_menu))
    .build(&el)
    .unwrap();

    el.run(move |e, _, control| {
        *control = ControlFlow::Wait;
        println!("{e:?}");
        match e {
            _ => (),
        }
    });

    dioxus_desktop::launch_cfg(App, Config::default().with_window(win));


    Ok(())
}

fn App(cx: Scope) -> Element {
    let coordinates = (42, 0);
    let country = "es";
    let hello = "Hello Dioxus!";
    let mut count = use_state(cx, || 0);

    let logged_in = use_state(cx, || false);


    cx.render(rsx! {
        div {
            div {
                span {
                    "hello, world!-{country}"
                }
                // "position": "{coordinates:?}",
                div {
                    "{country.to_uppercase()}"
                },
                div {
                    "{7*6}"
                },
                div {
                    "{{}}"
                }
            }
            div {
                a {
                    href: "https://www.xabwy.com/img/2022/2022-06/2022-06-20/b95c59b4cdfc2813d0c95a7ac6c8a221.jpg",
                    class: "primary_button",
                    color: "red"
                }
            }
            About {}
            button {
                onclick: move |e| println!("clicked! Event: {e:?}"),
                "click me!"
            }
    
            div {
                onclick: move |_e| println!("outer clicked! {_e:?}"),
                "outer",
                button {
                    onclick: move |e| {
                        // e.stop_propagation();
                        println!("inner clicked! {e:?}");
                    },
                    "inner"
                }
            }
    
            div {
                h1 { "Hive!!! {count}"}
                button {
                    onclick: move |_| {
                        count += 1
                    },
                    "Up high!"
                }
                button {
                    onclick: move |_| {
                        count -= 1
                    },
                    "Down low!"
                }
            }
        }
    })
}

pub fn About(cx: Scope) -> Element {
    cx.render(rsx! {
        p {
            b { "Dioxus Labs"}
            " An Open Source project dedicated to making Rust UI wonderful."
        }
    })
}